<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="<?=base_url()?>assets/library/aui/css/aui.2.0.css" />
    <link rel="stylesheet" type="text/css" href="<?=base_url()?>assets/wx/demo/css/style.css">
    <link rel="stylesheet" type="text/css" href="<?=base_url()?>assets/wx/demo/css/detail.css?<?=$time?>">
</head>
<body class="product-detail">

<section class="aui-content">
    <div class="aui-card-list aui-margin-b-10">
        <div class="aui-card-list-content">
            <img src="http://img.demo.qiuqiugu.com/a/thumb/2016/12/7e890f87bbf61addb67d82372cb21f9c.jpg@w640_h360.jpg" />
        </div>
        <div class="aui-card-list-footer gu-detail-card-list-footer">
            <div class="gu-detail-goods-name">
                <div class="left">
                    <a class="gu-detail-name aui-ellipsis-1">2016年7月12日</a>
                    <p class="gu-detail-goods-stars">
                        <img ng-repeat="i in stars" src="<?=base_url()?>assets/wx/img/stars.png" alt="">
                    </p>
                </div>
                <div class="right">
                    $ 200.23
                </div>
            </div>
        </div>
        <div class="aui-card-list-footer gu-detail-txt-property">
            <div class="gu-detail-zhengpin">农场直邮、正品保障</div>
            <div class="gu-detail-live">全程直播，生态健康</div>
        </div>
    </div>
</section>

<section class="aui-grid aui-margin-b-10">
    <div class="aui-row gu-liucheng">
        <div class="aui-col-xs-3 gu-col-xs">
            <span class="next"></span>
            <p><img src="<?=base_url()?>assets/wx/img/step1.png" alt=""></p>
            <div class="aui-grid-label">用户下单</div>
        </div>
        <div class="aui-col-xs-3 gu-col-xs">
            <span class="next"></span>
            <p><img src="<?=base_url()?>assets/wx/img/step2.png" alt=""></p>
            <div class="aui-grid-label">商家发货</div>
        </div>
        <div class="aui-col-xs-3 gu-col-xs">
            <span class="next"></span>
            <p><img src="<?=base_url()?>assets/wx/img/step3.png" alt=""></p>
            <div class="aui-grid-label">物流配送</div>
        </div>
        <div class="aui-col-xs-3 gu-col-xs">
            <p><img src="<?=base_url()?>assets/wx/img/step4.png" alt=""></p>
            <div class="aui-grid-label">买家收货</div>
        </div>
    </div>
</section>

<section class="aui-content">
    <div class="aui-card-list">
        <div class="aui-card-list-header">
            商品详情
        </div>
        <div class="aui-card-list-content" ng-bind-unsafe=""></div>
        <div class="aui-card-list-footer">
            2016年7月12日
        </div>
    </div>
</section>


<div class="gu-related-line">
    <span class="aui-text-primary">相关产品</span>
</div>

<section class="aui-grid aui-margin-b-15 gu-realted">
    <div class="aui-row">
        <div class="aui-col-xs-6 gu-related-item">
            <a href="/detail?id=1">
                <img class="aui-margin-b-5" src="http://img.demo.qiuqiugu.com/a/thumb/2016/12/7e890f87bbf61addb67d82372cb21f9c.jpg@w200_h200.jpg" onerror="" />
                <h4 ng-bind="" class="aui-text-default aui-ellipsis-2 aui-margin-b-5 aui-padded-b-5"> nadfaldfja</h4>
                <small ng-bind="'￥' + l.price">￥ 20.22</small>
            </a>
        </div>
        <div class="aui-col-xs-6 gu-related-item">
            <a href="/detail?id=1">
                <img class="aui-margin-b-5" src="http://img.demo.qiuqiugu.com/a/thumb/2016/12/7e890f87bbf61addb67d82372cb21f9c.jpg@w200_h200.jpg" onerror="" />
                <h4 ng-bind="" class="aui-text-default aui-ellipsis-2 aui-margin-b-5 aui-padded-b-5"> nadfaldfja</h4>
                <small ng-bind="'￥' + l.price">￥ 20.22</small>
            </a>
        </div>
        <div class="aui-col-xs-6 gu-related-item">
            <a href="/detail?id=1">
                <img class="aui-margin-b-5" src="http://img.demo.qiuqiugu.com/a/thumb/2016/12/7e890f87bbf61addb67d82372cb21f9c.jpg@w200_h200.jpg" onerror="" />
                <h4 ng-bind="" class="aui-text-default aui-ellipsis-2 aui-margin-b-5 aui-padded-b-5"> nadfaldfja</h4>
                <small ng-bind="'￥' + l.price">￥ 20.22</small>
            </a>
        </div>
        <div class="aui-col-xs-6 gu-related-item">
            <a href="/detail?id=1">
                <img class="aui-margin-b-5" src="http://img.demo.qiuqiugu.com/a/thumb/2016/12/7e890f87bbf61addb67d82372cb21f9c.jpg@w200_h200.jpg" onerror="" />
                <h4 ng-bind="" class="aui-text-default aui-ellipsis-2 aui-margin-b-5 aui-padded-b-5"> nadfaldfja</h4>
                <small ng-bind="'￥' + l.price">￥ 20.22</small>
            </a>
        </div>
        <div class="aui-col-xs-6 gu-related-item">
            <a href="/detail?id=1">
                <img class="aui-margin-b-5" src="http://img.demo.qiuqiugu.com/a/thumb/2016/12/7e890f87bbf61addb67d82372cb21f9c.jpg@w200_h200.jpg" onerror="" />
                <h4 ng-bind="" class="aui-text-default aui-ellipsis-2 aui-margin-b-5 aui-padded-b-5"> nadfaldfja</h4>
                <small ng-bind="'￥' + l.price">￥ 20.22</small>
            </a>
        </div>
        <div class="aui-col-xs-6 gu-related-item">
            <a href="/detail?id=1">
                <img class="aui-margin-b-5" src="http://img.demo.qiuqiugu.com/a/thumb/2016/12/7e890f87bbf61addb67d82372cb21f9c.jpg@w200_h200.jpg" onerror="" />
                <h4 ng-bind="" class="aui-text-default aui-ellipsis-2 aui-margin-b-5 aui-padded-b-5"> nadfaldfja</h4>
                <small ng-bind="'￥' + l.price">￥ 20.22</small>
            </a>
        </div>
    </div>
</section>

<section class="aui-grid aui-margin-b-0 gu-detail-buy">
    <div class="aui-row">
        <div class="aui-col-xs-3 gu-footer-btn">
            <i class="aui-iconfont aui-icon-map"></i>
            <div class="aui-grid-label">基地</div>
        </div>
        <div class="aui-col-xs-3 gu-footer-btn">
            <div class="aui-badge gu-badge">99</div>
            <i class="aui-iconfont aui-icon-cart aui-margin-t-5"></i>
            <div class="aui-grid-label">购物车</div>
        </div>
        <div class="aui-col-xs-6 gu-footer-btn gu-add-car">
            <div class="aui-grid-label gu-add-car-text" aui-popup-for="bottom">添加到购物车</div>
        </div>
    </div>
</section>


<!--弹出层-->
<div class="aui-popup aui-popup-bottom gu-alert-content" id="bottom">
    <div class="aui-popup-content gu-alert-inner-panel">
        <div class="aui-row aui-row-padded gu-alert-box">
            <div class="aui-col-xs-12 gu-header-bar"></div>
            <div class="aui-col-xs-12 gu-header">
                <div class="thumb">
                    <img src="http://img.demo.qiuqiugu.com/a/thumb/2016/12/7e890f87bbf61addb67d82372cb21f9c.jpg@w200_h200.jpg" alt="">
                </div>
                <div class="gu-header-title">
                    <h1>￥ 2100</h1>
                    <p>剩余库存 <span>213</span> 件</p>
                </div>
            </div>
            <div class="aui-col-xs-12 gu-guige">
                <div class="gu-inner">
                    规格说明: <i class="aui-label aui-label-primary">1箱 = 1.25KG</i><i class="aui-label aui-label-primary">商家包邮</i>
                </div>
            </div>
            <div class="aui-col-xs-12 gu-select">
                <div class="gu-inner">
                    <div class="gu-inner-left">
                        选购数量: <span>已选择 <i>1</i> 件</span>
                    </div>
                    <div class="gu-inner-right">
                        <div class="num">
                            <button type="button">-</button>
                            <span>1</span>
                            <button type="button">+</button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="aui-col-xs-12 gu-btns">
                <div class="gu-inner">
                    <a class="aui-btn aui-btn-primary">添加到购物车</a>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
<script type="text/javascript" src="<?=base_url()?>assets/library/aui/script/api.js"></script>
<script type="text/javascript" src="<?=base_url()?>assets/library/aui/script/aui-popup.js" ></script>
<script type="text/javascript">
    var popup = new auiPopup();
    function showPopup(){
        popup.show(document.getElementById("bottom"))
    }
</script>
<script type="text/javascript">

</script>
</html>